{% extends "base.html" %}

{% block title %}首页 - 妙趣拾光锦盒管理系统{% endblock %}

{% block content %}
<div class="row">
    <div class="col-12">
        <div class="card border-0 shadow-sm mb-4">
            <div class="card-body">
                <h2 class="text-primary"><i class="fas fa-box-open me-2"></i>欢迎使用妙趣拾光锦盒管理系统</h2>
                <p class="lead">这是一个为超市盲盒商品管理设计的管理系统，您可以通过左侧菜单进行各项操作。</p>
                <a href="{{ url_for('main.dashboard') }}" class="btn btn-primary">
                    <i class="fas fa-tachometer-alt me-1"></i>进入控制台
                </a>
            </div>
        </div>
    </div>
</div>

<!-- 盲盒推荐 -->
<div class="row mb-4">
    <div class="col-12">
        <div class="d-flex justify-content-between align-items-center mb-3">
            <h3 class="mb-0"><i class="fas fa-box me-2"></i>盲盒商品</h3>
            <a href="{{ url_for('blind_box.list') }}" class="btn btn-sm btn-outline-primary">查看更多 <i class="fas fa-arrow-right ms-1"></i></a>
        </div>
        <div class="row">
            {% for box in blind_boxes %}
            <div class="col-md-4 mb-4">
                <div class="card h-100 shadow-sm">
                    {% if box.image_url %}
                    <img src="{{ box.image_url }}" class="card-img-top" alt="{{ box.name }}" style="height: 180px; object-fit: cover;">
                    {% else %}
                    <div class="bg-light d-flex justify-content-center align-items-center" style="height: 180px;">
                        <i class="fas fa-box fa-3x text-muted"></i>
                    </div>
                    {% endif %}
                    <div class="card-body">
                        <h5 class="card-title">{{ box.name }}</h5>
                        <p class="card-text text-muted small">{{ box.description|truncate(100) }}</p>
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <span class="text-danger fw-bold">¥{{ box.discount_price }}</span>
                                <span class="text-muted text-decoration-line-through small">¥{{ box.original_price }}</span>
                            </div>
                            <a href="{{ url_for('blind_box.detail', box_id=box.box_id) }}" class="btn btn-sm btn-primary">
                                <i class="fas fa-info-circle me-1"></i>详情
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</div>

<!-- 合作超市 -->
<div class="row">
    <div class="col-12">
        <div class="d-flex justify-content-between align-items-center mb-3">
            <h3 class="mb-0"><i class="fas fa-shopping-cart me-2"></i>合作超市</h3>
            <a href="{{ url_for('supermarket.list') }}" class="btn btn-sm btn-outline-primary">查看更多 <i class="fas fa-arrow-right ms-1"></i></a>
        </div>
        <div class="row">
            {% for market in supermarkets %}
            <div class="col-md-4 mb-4">
                <div class="card h-100 shadow-sm">
                    {% if market.image_url %}
                    <img src="{{ market.image_url }}" class="card-img-top" alt="{{ market.name }}" style="height: 150px; object-fit: cover;">
                    {% else %}
                    <div class="bg-light d-flex justify-content-center align-items-center" style="height: 150px;">
                        <i class="fas fa-store fa-3x text-muted"></i>
                    </div>
                    {% endif %}
                    <div class="card-body">
                        <h5 class="card-title">{{ market.name }}</h5>
                        <p class="card-text"><i class="fas fa-map-marker-alt text-danger me-1"></i>{{ market.address }}</p>
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <span class="text-warning">
                                    {% for i in range(market.rating|int) %}
                                    <i class="fas fa-star"></i>
                                    {% endfor %}
                                    {% if market.rating - market.rating|int >= 0.5 %}
                                    <i class="fas fa-star-half-alt"></i>
                                    {% endif %}
                                </span>
                                <span class="ms-1">{{ market.rating }}</span>
                            </div>
                            <a href="{{ url_for('supermarket.detail', market_id=market.market_id) }}" class="btn btn-sm btn-primary">
                                <i class="fas fa-info-circle me-1"></i>详情
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</div>
{% endblock %} 